<template>
  <div class="inner-wrapper">
    <el-row>
      <el-col :span="24">
        <div class="grid-content">
          <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>控制器</el-breadcrumb-item>
            <el-breadcrumb-item>关机</el-breadcrumb-item>
          </el-breadcrumb>
        </div>
      </el-col>
    </el-row>

    <el-row>
      <el-table :data="tableAttr" border style="width: 100%">
        <el-table-column prop="index" label="INDEX">
          <template scope="scope">
            <span class="link" @click="getDetail(scope.row.index)">{{scope.row.index}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="NAME">
          <template scope="scope">
            <span class="link" @click="getDetail(scope.row.name)">{{scope.row.name}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="state"
          label="STATE">
        </el-table-column>
        <el-table-column
          prop="primary"
          label="PRIMARY">
          <template scope="scope">
            <input type="checkbox" v-model="scope.row.primary">
          </template>
        </el-table-column>
        <el-table-column
          prop="locality"
          label="LOCALITY">
        </el-table-column>
        <el-table-column
          prop="time"
          label="UP TIME(day(hh:mm))">
        </el-table-column>
        <el-table-column
          prop="rp_id"
          label="RP ID">
          <template scope="scope">
            <span>{{scope.row.rp_id.rp}}</span>
            <span>{{scope.row.rp_id.id}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="encl_index"
          label="ENCL INDEX">
        </el-table-column>
        <el-table-column
          prop="ula"
          label="ULA">
        </el-table-column>
        <el-table-column
          prop="icc"
          label="ICC">
          <template scope="scope">
            <span>{{scope.row.icc.status}}</span>
            <span>{{scope.row.icc.content}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="version"
          label="FIRMWARE VERSION">
        </el-table-column>
        <el-table-column
          prop="crash_dump"
          label="CRASH DUMP">
          <template scope="scope">
            <input type="checkbox" v-model="scope.row.crash_dump">
          </template>
        </el-table-column>
        <el-table-column
          prop="log_disk"
          label="LOG DISK">
          <template scope="scope">
            <input type="checkbox" v-model="scope.row.log_disk">
          </template>
        </el-table-column>
      </el-table>
    </el-row>
  </div>
</template>
<script>
  export default {
    name: 'controller_set',
    data () {
      return {
        tableAttr: [{
          index: 0,
          name: 'B',
          state: 'Running',
          primary: true,
          locality: 'LOCAL',
          time: '0 days(0:32)',
          rp_id: {rp: 1, id: '0x0001fffa01d6000'},
          encl_index: 0,
          ula: '0000000s02d0s2s',
          icc: {status: 'up', content: 'DG+MSG+MAD'},
          version: '3.10.0132795',
          crash_dump: true,
          log_disk: false
        }, {
          index: 1,
          name: 'A',
          state: 'Running',
          primary: false,
          locality: 'REMOTE',
          time: '0 days(0:32)',
          rp_id: {rp: 1, id: '0x0001fffa01d6000'},
          encl_index: 2,
          ula: '0fd1f4g1ed25g4',
          icc: {status: 'up', content: 'DG+MSG+MAD'},
          version: '3.10.1547201144',
          crash_dump: false,
          log_disk: true
        }]
      }
    },
    methods: {
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" rel="stylesheet/scss">

</style>
